<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="account" class="containner">
			<div class="text-left text-lg gray bold">填写并核对订单信息</div>
			<div class="mt-20 px-20 py-20 rounded box-shadow">
				<div class="text-left text-md dark bold">收货人信息</div>
				<div class="mt-10 flex justify-between item-center">
					<div class="flex item-center">
						<div class="address-name ml-20 py-10 px-20 rounded text-md dark hand hover-red">张三</div>
						<div class="ml-20 text-md dark">张三</div>
						<div class="ml-20 text-md dark">江苏省</div>
						<div class="ml-10 text-md dark">南京市</div>
						<div class="ml-10 text-md dark">市辖区</div>
						<div class="ml-10 text-md dark">秦淮区中华路127号外运大厦北楼18楼</div>
						<div class="ml-20 text-md dark">13600000001</div>
					</div>
					<div class="text-md dark hover-red hand">修改收货信息</div>
				</div>
			</div>
			<div class="flex justify-between item-center wrap" style="display: none;">
				<div class="address-bar hand account-address active">
					<div>
						<div class="flex justify-between item-center dark text-left text-lg bold">
							<div class="flex item-center">
								<div>张三</div>
								<div class="ml-10">江苏省</div>
							</div>
							<div class="hand gray hover-red">×</div>
						</div>
						<div class="flex justify-between item-end mt-20">
							<div class="address-left">
								<div class="flex item-center text-sm">
									<div class="address-title text-right gray">收货人：</div>
									<div class="text-left dark">张三</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">所在地区：</div>
									<div class="text-left dark">江苏省南京市市辖区</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">地址：</div>
									<div class="text-left dark">秦淮区中华路127号外运大厦北楼18楼</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">手机：</div>
									<div class="text-left dark">13600000001</div>
								</div>
							</div>
							<div class="address-right">
								<div class="text-right text-sm gray hover-red hand">编辑</div>
								<div class="text-right text-sm gray hover-red hand mt-10">设为默认</div>
							</div>
						</div>
					</div>
					<div style="display: none;"><input type="text" placeholder="请填写收货人姓名"
							class="addr_text hand gray"><input type="text" placeholder="请填写收货人手机号码"
							class="addr_text hand gray mt-10">
						<div class="mt-10 flex justify-between item-center"><select class="address_select hand">
								<option>北京市</option>
								<option>天津市</option>
								<option>河北省</option>
								<option>山西省</option>
								<option>内蒙古自治区</option>
								<option>辽宁省</option>
								<option>吉林省</option>
								<option>黑龙江省</option>
								<option>上海市</option>
								<option>江苏省</option>
								<option>浙江省</option>
								<option>安徽省</option>
								<option>福建省</option>
								<option>江西省</option>
								<option>山东省</option>
								<option>河南省</option>
								<option>湖北省</option>
								<option>湖南省</option>
								<option>广东省</option>
								<option>广西壮族自治区</option>
								<option>海南省</option>
								<option>重庆市</option>
								<option>四川省</option>
								<option>贵州省</option>
								<option>云南省</option>
								<option>西藏自治区</option>
								<option>陕西省</option>
								<option>甘肃省</option>
								<option>青海省</option>
								<option>宁夏回族自治区</option>
								<option>新疆维吾尔自治区</option>
								<option>新疆建设兵团</option>
							</select><select class="address_select hand"></select><select
								class="address_select hand"></select></div><input type="text" placeholder="请填写收获详细地址"
							class="addr_text hand gray mt-10">
						<div class="mt-20 flex justify-end item-center"><button
								class="address-btn btn-save hand rounded"> 保 存 </button><button
								class="address-btn btn-cancel hand rounded ml-20"> 取 消 </button></div>
					</div>
				</div>
				<div class="address-bar hand account-address">
					<div>
						<div class="flex justify-between item-center dark text-left text-lg bold">
							<div class="flex item-center">
								<div>王五</div>
								<div class="ml-10">山东省</div>
							</div>
							<div class="hand gray hover-red">×</div>
						</div>
						<div class="flex justify-between item-end mt-20">
							<div class="address-left">
								<div class="flex item-center text-sm">
									<div class="address-title text-right gray">收货人：</div>
									<div class="text-left dark">王五</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">所在地区：</div>
									<div class="text-left dark">山东省济南市市辖区</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">地址：</div>
									<div class="text-left dark">历下区解放东路30号东源大厦23楼</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">手机：</div>
									<div class="text-left dark">13600000003</div>
								</div>
							</div>
							<div class="address-right">
								<div class="text-right text-sm gray hover-red hand">编辑</div>
								<div class="text-right text-sm gray hover-red hand mt-10">设为默认</div>
							</div>
						</div>
					</div>
					<div style="display: none;"><input type="text" placeholder="请填写收货人姓名"
							class="addr_text hand gray"><input type="text" placeholder="请填写收货人手机号码"
							class="addr_text hand gray mt-10">
						<div class="mt-10 flex justify-between item-center"><select class="address_select hand">
								<option>北京市</option>
								<option>天津市</option>
								<option>河北省</option>
								<option>山西省</option>
								<option>内蒙古自治区</option>
								<option>辽宁省</option>
								<option>吉林省</option>
								<option>黑龙江省</option>
								<option>上海市</option>
								<option>江苏省</option>
								<option>浙江省</option>
								<option>安徽省</option>
								<option>福建省</option>
								<option>江西省</option>
								<option>山东省</option>
								<option>河南省</option>
								<option>湖北省</option>
								<option>湖南省</option>
								<option>广东省</option>
								<option>广西壮族自治区</option>
								<option>海南省</option>
								<option>重庆市</option>
								<option>四川省</option>
								<option>贵州省</option>
								<option>云南省</option>
								<option>西藏自治区</option>
								<option>陕西省</option>
								<option>甘肃省</option>
								<option>青海省</option>
								<option>宁夏回族自治区</option>
								<option>新疆维吾尔自治区</option>
								<option>新疆建设兵团</option>
							</select><select class="address_select hand"></select><select
								class="address_select hand"></select></div><input type="text" placeholder="请填写收获详细地址"
							class="addr_text hand gray mt-10">
						<div class="mt-20 flex justify-end item-center"><button
								class="address-btn btn-save hand rounded"> 保 存 </button><button
								class="address-btn btn-cancel hand rounded ml-20"> 取 消 </button></div>
					</div>
				</div>
				<div class="address-bar hand account-address">
					<div>
						<div class="flex justify-between item-center dark text-left text-lg bold">
							<div class="flex item-center">
								<div>赵六</div>
								<div class="ml-10">江苏省</div>
							</div>
							<div class="hand gray hover-red">×</div>
						</div>
						<div class="flex justify-between item-end mt-20">
							<div class="address-left">
								<div class="flex item-center text-sm">
									<div class="address-title text-right gray">收货人：</div>
									<div class="text-left dark">赵六</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">所在地区：</div>
									<div class="text-left dark">江苏省苏州市太仓市</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">地址：</div>
									<div class="text-left dark">abc</div>
								</div>
								<div class="flex item-center text-sm mt-10">
									<div class="address-title text-right gray">手机：</div>
									<div class="text-left dark">13600000001</div>
								</div>
							</div>
							<div class="address-right">
								<div class="text-right text-sm gray hover-red hand">编辑</div>
								<div class="text-right text-sm gray hover-red hand mt-10">设为默认</div>
							</div>
						</div>
					</div>
					<div style="display: none;"><input type="text" placeholder="请填写收货人姓名"
							class="addr_text hand gray"><input type="text" placeholder="请填写收货人手机号码"
							class="addr_text hand gray mt-10">
						<div class="mt-10 flex justify-between item-center"><select class="address_select hand">
								<option>北京市</option>
								<option>天津市</option>
								<option>河北省</option>
								<option>山西省</option>
								<option>内蒙古自治区</option>
								<option>辽宁省</option>
								<option>吉林省</option>
								<option>黑龙江省</option>
								<option>上海市</option>
								<option>江苏省</option>
								<option>浙江省</option>
								<option>安徽省</option>
								<option>福建省</option>
								<option>江西省</option>
								<option>山东省</option>
								<option>河南省</option>
								<option>湖北省</option>
								<option>湖南省</option>
								<option>广东省</option>
								<option>广西壮族自治区</option>
								<option>海南省</option>
								<option>重庆市</option>
								<option>四川省</option>
								<option>贵州省</option>
								<option>云南省</option>
								<option>西藏自治区</option>
								<option>陕西省</option>
								<option>甘肃省</option>
								<option>青海省</option>
								<option>宁夏回族自治区</option>
								<option>新疆维吾尔自治区</option>
								<option>新疆建设兵团</option>
							</select><select class="address_select hand"></select><select
								class="address_select hand"></select></div><input type="text" placeholder="请填写收获详细地址"
							class="addr_text hand gray mt-10">
						<div class="mt-20 flex justify-end item-center"><button
								class="address-btn btn-save hand rounded"> 保 存 </button><button
								class="address-btn btn-cancel hand rounded ml-20"> 取 消 </button></div>
					</div>
				</div>
				<div class="address-append-bar">
					<div>
						<div class="append-tag">+</div>
					</div>
					<div style="display: none;"><input type="text" placeholder="请填写收货人姓名"
							class="addr_text hand gray"><input type="text" placeholder="请填写收货人手机号码"
							class="addr_text hand gray mt-10">
						<div class="mt-10 flex justify-between item-center"><select class="address_select hand">
								<option>北京市</option>
								<option>天津市</option>
								<option>河北省</option>
								<option>山西省</option>
								<option>内蒙古自治区</option>
								<option>辽宁省</option>
								<option>吉林省</option>
								<option>黑龙江省</option>
								<option>上海市</option>
								<option>江苏省</option>
								<option>浙江省</option>
								<option>安徽省</option>
								<option>福建省</option>
								<option>江西省</option>
								<option>山东省</option>
								<option>河南省</option>
								<option>湖北省</option>
								<option>湖南省</option>
								<option>广东省</option>
								<option>广西壮族自治区</option>
								<option>海南省</option>
								<option>重庆市</option>
								<option>四川省</option>
								<option>贵州省</option>
								<option>云南省</option>
								<option>西藏自治区</option>
								<option>陕西省</option>
								<option>甘肃省</option>
								<option>青海省</option>
								<option>宁夏回族自治区</option>
								<option>新疆维吾尔自治区</option>
								<option>新疆建设兵团</option>
							</select><select class="address_select hand"></select><select
								class="address_select hand"></select></div><input type="text" placeholder="请填写收获详细地址"
							class="addr_text hand gray mt-10">
						<div class="mt-20 flex justify-end item-center"><button
								class="address-btn btn-save hand rounded"> 保 存 </button><button
								class="address-btn btn-cancel hand rounded ml-20"> 取 消 </button></div>
					</div>
				</div>
			</div>
			<div class="mt-20 px-20 py-20 rounded box-shadow">
				<div class="text-left text-md dark bold">配送清单</div>
				<div class="flex justify-between item-center text-md dark bg-gray px-20 py-5 cart-header my-20">
					<div class="mx-5"></div>
					<div class="cart-product mx-5">商品</div>
					<div class="cart-param mx-5">单价</div>
					<div class="cart-param mx-5">数量</div>
					<div class="cart-param mx-5">小计</div>
					<div class="cart-param mx-5"></div>
				</div>
				<div class="flex justify-between item-center text-md dark my-10 px-20 py-5 cart-body">
					<div class="mx-5"></div>
					<div class="cart-product mx-5 flex item-start"><img
							src="http://127.0.0.1:8001/img/group1/M00/00/00/536-357b6917e1d711d5.jpg" width="80px"
							height="80px" class="rounded hand">
						<div class="cart-name mx-10 text-left flex-column justify-between item-start">
							<div class="hover-red hand ">荣耀智慧屏X1 75英寸LOK-370 教育电视 荣耀智慧屏X1系列 【新品】X1 75“ 沉浸巨幕</div>
							<div class="cart-sku flex item-center">
								<div class="gray text-sm pr-5 hand hover-red"> 荣耀智慧屏X1系列 </div>
								<div class="gray text-sm pr-5 hand hover-red"> 【新品】X1 75“ 沉浸巨幕 </div>
							</div>
						</div>
					</div>
					<div class="cart-param mx-5">￥5899</div>
					<div class="cart-param mx-5">1</div>
					<div class="cart-param mx-5">￥5899</div>
					<div class="cart-param mx-5 hover-red hand"></div>
				</div>
			</div>
			<div class="px-20 py-20">
				<div class="flex justify-end item-center text-right text-sm gray mt-20">
					<div class="account-left">商品总金额：</div>
					<div class="account-right">￥5899</div>
				</div>
				<div class="flex justify-end item-center text-right text-sm gray mt-10">
					<div class="account-left">配送费：</div>
					<div class="account-right">￥0</div>
				</div>
				<div class="flex justify-end item-center text-right text-sm gray mt-10">
					<div class="account-left">订单总金额：</div>
					<div class="account-right">￥5899</div>
				</div>
				<div class="flex justify-end item-center text-right text-sm gray mt-10">
					<div class="account-left">优惠金额：</div>
					<div class="account-right">￥0</div>
				</div>
				<div class="flex justify-end item-center text-right text-sm gray mt-20">
					<div class="account-left text-lg dark bold">应付总金额：</div>
					<div class="account-right text-xl red weight">￥5899</div>
				</div>
				<div class="flex justify-end item-center text-right text-sm gray mt-20">
					<div>配送至：</div>
					<div class="ml-5">江苏省</div>
					<div class="ml-5">南京市</div>
					<div class="ml-5">市辖区</div>
					<div class="ml-5">秦淮区中华路127号外运大厦北楼18楼</div>
					<div class="ml-20">收货人：</div>
					<div class="ml-5">张三</div>
					<div class="ml-5">13600000001</div>
				</div>
				<div class="flex justify-end mt-20"><button class="btn-account hand">提交订单</button></div>
			</div>
		</div>
	</body>
</html>
